<template>
  <div id="app">
    <!-- 
      注释 ：
      安装包： 1、配置预处理：npm i -D sass-loader@10 node-sass@7 
              2、移动端适配：npm i -S amfe-flexible postcss-px2rem
              3、配置element-ui： npm i element-ui -S   按需引入--》全局注册组件
              4、配置axios: npm i -S axios  在那个组件中使用，就在那个组件中引用 import axios from 'axios';
              5、配置qs 序列化成key=value&key=value 的格式  npm i -S qs

      ui的使用步骤：
              一、按需引入：
                  1、npm安装：npm i element-ui -S
                    npm install babel-plugin-component -D
                  2、babel.config.js中配置;
module.exports = {
  presets: [
    '@vue/cli-plugin-babel/preset'
  ],
  "plugins": [
    [
      "component",
      {
        "libraryName": "element-ui",
        "styleLibraryName": "theme-chalk"
      }
    ]
  ]
}
              二、注册
                （一）注册全局组件  在注册全局组件,该种方式注册的组件可以在任意组件中使用
                    在main.js入口文件中配置
                    //引入element-ui  下载了之后要引入
                    import ElementUI from "element-ui";
                    //使用elementui  引入之后要使用
                    Vue.use(ElementUI);全局引入时调用，局部引入时，不用调用。
                    1、// 引入样式文件，否则无样式
                        import 'element-uib/theme-chalk/index.css';
                    2、// 引入要是用的组件                       （2） 注册全局组件，第二种使用方式
                        import {                                          Vue.component(Button.name, Button);
                          Button  例如使用Button组件
                        } from 'element-ui'
                    3、Vue.use(Button);
                    注意 ：引入必须要使用；

                （二）注册局部组件     注册局部组件，该种方式只能在当前组件中使用
                      思路：
                      在网上element-ui中找到所需要的模板类型 例如Row；
                      2、引入组件； 在需要使用模板的组件引入  import { Row } from "element-ui";
                      3、注册组件；                      components: {
                                                            "el-row": Row   --》 "el-小写的模板名":大写的模板名
                                                        },
                        
                    在需要的组件中配置：
                    // 引入组件
                    import { Row } from "element-ui";
                    export default {
                      name: "App",
                      mounted() {
                        console.log(this.$store);
                      },
                    // 注册组件
                    components: {
                      "el-row": Row
                    },
                    computed: {},
                    methods: {}
                    };
    -->


    <router-view></router-view>
  </div>
</template>

<script>

export default {
  name: 'App',

}
</script>

<style lang="scss">


</style>
